﻿
@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<div class="col-md-4" id="budgetDonut" style="height: 250px"></div>
<script src="~/Scripts/raphael-min.js"></script>
<script src="~/Scripts/morris.min.js"></script>
<script>
    $(document).ready(function() {

        //Budget Donut Chart
        var donut = new Morris.Donut({
            element: 'budgetDonut',
            resize: true,
            colors: ["#3c8dbc", "#f56954", "#00a65a"],
            data: [
                @{int count = 1;}
                @foreach (var item in Model[0] as Dictionary<string, int>)
                {
                    if (count < Model.Count)
                    {
                        @Html.Raw("{label: \"" + item.Key + "\", value: " + item.Value + "},")
                        ;
                    }
                    else
                    {
                        @Html.Raw("{label: \"" + item.Key + "\", value: " + item.Value + "}")
                        ;
                    }
                    count++;

                }
            ],
            hideHover: 'auto'
        });})
</script>